---
title: Print Plugin
description: Enables high-quality printing of PDF documents by leveraging the browser's native print dialog in Vue.
searchable: true
---

# Print Plugin

The Print Plugin provides a simple and effective way to print your PDF document. It prepares a high-quality, print-ready version of the file and opens the browser's native print dialog for the user.

## Installation

The plugin is available as a separate NPM package.

```sh npm2yarn
npm install @embedpdf/plugin-print
````

## Registration

Import `PrintPluginPackage` and add it to the `plugins` array in your viewer. This plugin has no configuration options.

```typescript {3, 13}
import { createPluginRegistration } from '@embedpdf/core'
// ... other imports
import { PrintPluginPackage } from '@embedpdf/plugin-print/vue'

const plugins = [
  // ... other essential plugins
  createPluginRegistration(LoaderPluginPackage, { /* ... */ }),
  createPluginRegistration(ViewportPluginPackage),
  createPluginRegistration(ScrollPluginPackage),
  createPluginRegistration(RenderPluginPackage),

  // Register the print plugin
  createPluginRegistration(PrintPluginPackage),
]
```

## Usage

The plugin works by combining a composable for initiating the print job with a component that handles the browser interaction.

### 1\. Triggering a Print Job

Use the `usePrintCapability` composable to get access to the plugin's `print` method. You can call this method from any component, such as a button in your toolbar.

The `print` method returns a `Task`, which allows you to track the progress and handle success or failure, perfect for showing a loading state to the user.

```vue
<script setup lang="ts">
import { ref } from 'vue';
import { usePrintCapability } from '@embedpdf/plugin-print/vue';

const { provides: print } = usePrintCapability();
const isPrinting = ref(false);

const handlePrint = () => {
  if (!print.value || isPrinting.value) return;
  isPrinting.value = true;
  
  // Prints the entire document
  const printTask = print.value.print();

  printTask.wait(
    () => { isPrinting.value = false; }, // On success
    (error) => { isPrinting.value = false; console.error(error) }, // On failure
  );
};
</script>

<template>
  <button @click="handlePrint" :disabled="isPrinting">
    {{ isPrinting ? 'Preparing...' : 'Print' }}
  </button>
</template>
```

### 2\. Handling the Print Dialog (Behind the Scenes)

The plugin automatically adds a hidden `<PrintFrame />` component to your application. You do not need to render this component yourself.

When you call `provides.value.print()`, this component listens for the prepared document, loads it into an invisible `<iframe>`, and calls the browser's `window.print()` method to open the print dialog. This entire process is handled for you.

## Live Example

This example shows a viewer with a print button. Clicking it will prepare the document and open your browser's print dialog.

import { PrintExample } from '../code-examples/print-example';

<PrintExample />

## API Reference

### Composable: `usePrintCapability()`

This composable connects your component to the print plugin's functions.

#### Returns

| Property | Type | Description |
| :--- | :--- | :--- |
| **`provides`** | `Ref<PrintCapability \| null>` | A ref object with methods to control printing, or `null` if the plugin is not ready. |

#### `PrintCapability` Methods

| Method | Description |
| :--- | :--- |
| **`print(options)`** | Prepares the document for printing and opens the print dialog. Returns a `Task` that resolves when the dialog is opened. |

#### `PdfPrintOptions`

The `options` object passed to the `print` method. (Type imported from `@embedpdf/models`).

| Option | Type | Description |
| :--- | :--- | :--- |
| **`pageRanges`** | `string` | A string specifying which pages to print, e.g., "1-3, 5, 8". If omitted, all pages are printed. |
| **`includeAnnotations`**| `boolean`| Whether to include annotations in the printed output. <br />**Default**: `true` |